<template>
	<!-- 客户-跟进日报 -->
	<el-card>
		<view class="info" style="margin-bottom: 20px">
			<el-descriptions title="ClientInfo 客户信息" :border="true">
				<el-descriptions-item label="ClientName 客户名字">{{ clientInfo.name }}</el-descriptions-item>
				<el-descriptions-item label="ClientMobile 电话号码">{{ clientInfo.mobile }}</el-descriptions-item>
				<el-descriptions-item label="Market 市场">{{ clientInfo.market }}</el-descriptions-item>
				<el-descriptions-item label="Business 生意">{{ clientInfo.business }}</el-descriptions-item>
				<el-descriptions-item label="Ghana Sales 加纳销售">{{ clientInfo.salesName }}</el-descriptions-item>
				<el-descriptions-item label="Ghana CS 加纳客服">{{ clientInfo.csName }}</el-descriptions-item>
				<el-descriptions-item label="Store No 店铺号码">{{ clientInfo.shopNo }}</el-descriptions-item>
			</el-descriptions>
		</view>
		<follow-table v-if="showTable" style="margin-top: 10px" type="client" :client-id="clientId"
			:client-name="clientInfo.name" :mobile="clientInfo.mobile"></follow-table>
	</el-card>
</template>

<script setup lang="ts">
import { useCrud } from '@/hooks'
import { reactive, ref } from 'vue'
import FollowTable from './follow-table.vue'
import { useClientApi } from '@/api/client'
import { IHooksOptions } from '@/hooks/interface'
import { useRouter } from 'vue-router'
import store from '@/store'

const router = useRouter()

const clientInfo = reactive({})
const showTable = ref(false)

let queryClientId = router.currentRoute.value.query.clientId

if (queryClientId) {
	store.commonStore?.setClientId(queryClientId)
}
const clientId = store.commonStore.clientId

const followTable = ref()

const getClientInfo = (id: any) => {
	useClientApi(id).then(res => {
		Object.assign(clientInfo, res.data)
		showTable.value = true
	})
}
getClientInfo(clientId)
</script>
